<template>
  <div style="padding: 15px;">
    <el-form ref="form" :model="form" :rules="rules" label-width="80px" :key="formKey">
      <el-form-item label="审批状态" prop="status">
        <el-radio-group v-model="form.status" @change="funcChangeCheckStatus">
          <el-radio label="1" value="1">通过</el-radio>
          <el-radio label="2" value="2">驳回</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="审批意见" prop="approvalOpinions">
        <el-input type="textarea" v-model="form.approvalOpinions"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="funcSubmit">提交</el-button>
        <el-button @click="fucCancel">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
  import { receiptAudit } from "@/api/settlement";

  export default {
    name: "moveAudit",
    data() {
      return {
        formKey: 0,
        form: {
          code: "",
          status: "1",
          approvalOpinions: "",
        },

        rules: {
          status: [
            { required: true, message: "请选择审批状态", trigger: "blur" },
          ],
        },

        approvalOpinions: [
          { required: true, message: "请输入审批意见", trigger: "blur" },
        ]

      };
    },

    created() {},
    methods: {
      // 初始化移位单code
      getInfo(code) {
        this.$refs.form.resetFields();
        this.form.code = code;
      },
      // 审核状态调整事件
      funcChangeCheckStatus(val){
        // 驳回需要填写审核意见，需要动态添加必填规则
        if(val == '2'){
          this.rules.approvalOpinions = this.approvalOpinions;
        }else{
          delete this.rules.approvalOpinions;
        }
        // key改变，key改变vue会默认重新渲染该组件
        ++this.formKey;
      },

      // 移位单审核功能
      funcSubmit() {
        this.$refs.form.validate((valid) => {
          if (valid) {
            // 提交
            let code = this.form.code
            let status = this.form.status 
            let verifyOpinion = this.form.verifyOpinion
            receiptAudit(status,verifyOpinion,code).then((response) => {
              // 审核成功则返回到列表页面
              if(response.status == 0){
                this.$message({message:'操作成功', type:'success'});
                this.$emit("fatherCheckMethod");
              }else{
                // 审核失败提示信息
                this.$message.error(response.msg);
              }
            });
          }
        });
      },

      fucCancel() {
        this.$emit("fatherCancelMethod", "check");
      },
    },
  };
</script>

<style>
  .vxe-table .vxe-body--column:not(.col--ellipsis),
  .vxe-table .vxe-footer--column:not(.col--ellipsis),
  .vxe-table .vxe-header--column:not(.col--ellipsis) {
    padding: 6px 0;
  }
  .vxe-toolbar {
    padding: 0 0 10px 0;
  }
</style>
